<template>
  <div>
    <content-wrapper
      :tableList="tableList"
      :searchList="searchList"
      :setting="setting"
      @changeOpt="changeOpt"
      @changeTable="changeTable"
      @formValue="formValue"
    >
      <div slot="searchLeft">
        <a-button
          type="primary"
          style="margin-right: 20px"
          @click="$commonJs.goPage('addPosted')"
          :disabled="!$commonJs.isAth('addPosted')"
        >
          <a-icon type="plus" />
          新增
        </a-button>
        <a-button type="primary" style="margin-right: 20px" @click="exportFile">
          <a-icon type="cloud-download" />
          导出
        </a-button>
      </div>
    </content-wrapper>
  </div>
</template>

<script>
import { mapState } from "vuex";
import { Modal } from "ant-design-vue";
export default {
  name: "index",
  components: {
    contentWrapper: () => import("@/components/contentWrapper/index")
  },
  computed: {
    ...mapState(["isPC"])
  },
  data() {
    return {
      tableList: {
        columns: [
          {
            title: "ID",
            dataIndex: "id",
            align: "center",
            isShowMobile: true,
            width: 60,
            key: "id"
          },
          {
            title: "标题",
            dataIndex: "text",
            width: 180,
            type: "title",
            scopedSlots: { customRender: "text" },
            key: "title"
          },
          {
            title: "项目名称",
            dataIndex: "item",
            width: 150
          },
          {
            title: "群组",
            width: 150,
            dataIndex: "group"
          },
          {
            title: "影视学堂",
            width: 150,
            dataIndex: "movie_id"
          },
          {
            title: "发帖人/ID",
            dataIndex: "set_posts_name",
            width: 80
          },
          {
            title: "审核状态",
            dataIndex: "status",
            width: 80,
            align: "center",
            type: "tag",
            scopedSlots: { customRender: "status" },
            key: "status"
          },
          {
            title: "备注",
            dataIndex: "error",
            width: 150,
            scopedSlots: { customRender: "error" }
          },
          {
            title: "收藏人数",
            width: 90,
            dataIndex: "collect_num"
          },
          {
            title: "点赞人数",
            width: 90,
            dataIndex: "like_num"
          },
          {
            title: "发布时间",
            width: 180,
            dataIndex: "created_at"
          },
          {
            title: "操作",
            dataIndex: "opt",
            width: 190,
            scopedSlots: { customRender: "postedOpt" },
            isShowMobile: true,
            key: "opt"
          }
        ],
        dataSource: [],
        pagination: {
          current: 1,
          pageSize: 10,
          total: 0
        },
        sorter: {}
      },
      searchList: [
        {
          type: "input",
          label: "标题",
          placeholder: "标题",
          name: "title"
        },
        {
          type: "input",
          label: "发帖人",
          placeholder: "发帖人",
          name: "thePoster"
        },
        {
          type: "search",
          label: "项目",
          name: "project",
          option: [
            {
              value: 0,
              title: "全部"
            }
          ]
        },
        {
          type: "search",
          label: "群组",
          name: "group",
          option: [
            {
              value: 0,
              title: "全部"
            }
          ]
        },
        {
          type: "search",
          label: "审核状态",
          name: "status",
          option: [
            {
              value: 1,
              title: "待审核"
            },
            {
              value: 2,
              title: "已拒绝"
            },
            {
              value: 3,
              title: "已通过"
            }
          ]
        }
      ],
      searchInfo: {
        title: "",
        thePoster: "",
        project: "",
        group: "",
        movie: ""
      },
      group: [],
      project: [],
      setting: {}
    };
  },
  methods: {
    changeOpt(item, type) {
      switch (type) {
        case "delete":
          this.del(item);
      }
    },
    del(item) {
      let that = this;
      Modal.confirm({
        title: "您确定删除该贴吗？",
        okText: "确定",
        okType: "danger",
        cancelText: "取消",
        onOk() {
          that.$ajax
            .post(that.$api.delPosts, { id: item.id })
            .then(() => {
              that.$notification.success({
                message: "删除成功！"
              });
              that.getInfo();
            })
            .catch(err => {
              that.$notification.error({
                message: err
              });
            });
        }
      });
    },
    changeTable(pagination) {
      Object.assign(this.tableList.pagination, pagination);
      this.getInfo();
    },
    formValue(values) {
      this.tableList.pagination.current = 1;
      Object.assign(this.searchInfo, values);
      this.getInfo();
    },
    exportFile() {
      let url = this.$api.downloadPostsList;
      if (this.searchInfo.title) {
        url += "&title=" + this.searchInfo.title;
      } else {
        url += "&title=";
      }
      if (this.searchInfo.thePoster) {
        url += "&set_posts_name=" + this.searchInfo.thePoster;
      } else {
        url += "&set_posts_name=";
      }
      if (this.searchInfo.project) {
        url += "&item_id=" + this.searchInfo.project;
      } else {
        url += "&item_id=";
      }
      if (this.searchInfo.group) {
        url += "&group_id=" + this.searchInfo.group;
      } else {
        url += "&group_id=";
      }
      url +=
        "&excel_download=1&token=" +
        this.$crypto.getAES(localStorage.getItem("token"));
      const a = document.createElement("a"); // 创建a标签
      a.setAttribute("download", ""); // download属性
      a.setAttribute("href", url); // href链接
      a.click(); // 自执行点击事件
    },
    getInfo() {
      this.$ajax
        .get(this.$api.postsList, {
          title: this.searchInfo.title,
          set_posts_name: this.searchInfo.thePoster,
          item_id: this.searchInfo.project,
          group_id: this.searchInfo.group,
          status: this.searchInfo.status,
          movie_id: this.searchInfo.movie,
          page_size: this.tableList.pagination.pageSize,
          page: this.tableList.pagination.current
        })
        .then(res => {
          for (let item of res.data) {
            if (item.error === null) {
              item.error = "";
            }
            item.created_at = this.$commonJs.timer(item.created_at);
          }
          this.tableList.dataSource = res.data;
          this.tableList.pagination.total = res.total_count;
        })
        .catch(err => {
          this.$notification.error({
            message: err
          });
        });
      this.$ajax
        .get(this.$api.addPosts, false)
        .then(res => {
          let project = [];
          let group = [];
          for (let item of this.searchList) {
            if (item.name === "project") {
              for (let i of res.project) {
                let n = {};
                n.value = i.id - 0;
                n.title = i.title;
                project.push(n);
              }
              item.option = project;
            } else if (item.name === "group") {
              for (let i of res.groupInfo) {
                let n = {};
                n.value = i.id - 0;
                n.title = i.name;
                group.push(n);
              }
              item.option = group;
            }
          }
        })
        .catch(err => {
          this.$notification.error({
            message: err
          });
        });
    }
  },
  beforeRouteUpdate(to, from, next) {
    if (
      to.name === "associationPosted" &&
      (from.name === "addPosted" ||
        from.name === "detailPosted" ||
        from.name === "checkPosted")
    ) {
      this.getInfo();
    }
    next();
  },
  created() {
    if (this.$route.query.member) {
      this.searchInfo.thePoster = this.$route.query.member;
    } else if (this.$route.query.manage) {
      this.searchInfo.group = this.$route.query.manage;
    } else if (this.$route.query.project) {
      this.searchInfo.project = this.$route.query.project;
    } else if (this.$route.query.toAudit) {
      this.searchInfo.status = this.$route.query.toAudit;
    } else if (this.$route.query.movie) {
      this.searchInfo.movie = this.$route.query.movie;
    }
    if (!this.isPC) {
      this.tableList.pagination.pageSize = 6;
      this.searchInfo.status = 1;
    }
    this.getInfo();
  }
};
</script>

<style scoped lang="less"></style>
